<template>
  <div>
    <!-- 前置弹窗 -->
    <addBeforeDialog ref="addBeforeDialog" @next="nextStep"></addBeforeDialog>
    <!-- 发布页弹窗 -->
    <el-dialog class="add_dialog" :title="title" :visible.sync="dialogVisible" :close-on-click-modal="false" append-to-body fullscreen width="100%" @close="close" :close-on-press-escape="false">
      <div class="add-edit-box">
        <span class="ceshifont"> </span>
        <div class="flex" v-loading="loading">
          <div class="form-box" @click="boxradioIsShow = ''">
            <el-form ref="form" :model="form" :inline="true" :rules="rules" label-width="80px" class="demo-ruleForm new_form_box">
              <div class=" step-box ">
                <!-- <div style="margin-bottom: 10px;padding-left: 15px" v-if="!isEdit&&AllgameList.length">
                  <el-input placeholder="请输入关键字搜索" suffix-icon="el-icon-search" v-model="keyword" @change="searchGame">
                  </el-input>
                  <el-button style="margin-left: 10px;" type="primary" @click="searchGame">搜索</el-button>
                  <el-button style="margin-left: 10px;" type="primary" plain @click="closeFn('GameSetting')">游戏管理</el-button>
                </div>
                <div class="game-box flex" v-if="!isEdit&&AllgameList.length">
                  <div class="select-game-item" :class="{active:form.gameId==item.id}" v-for="item in gameList " :key="item.id" @click="tabChange(item.id,item)">
                    <div class="img">
                      <img :src="item.icon" alt="">
                      <div class="sign" v-if="GetIsKuaiSu(item.id)">快</div>
                    </div>
                    <div class="gametit">{{ item.name }}</div>

                  </div>
                </div>
                <div style="height: 50px;line-height: 50px;font-size: 20px;text-align: center;" v-if="!isEdit&&AllgameList.length==0">
                  暂未设置游戏， <el-button type="text" style="font-size: 20px;" @click="closeFn('GameSetting')">立即设置</el-button>
                </div> -->
                <!-- <div class="gameInfo" v-if="currentGame&&currentGame.id">
                  <div>
                    <b>游戏名称：</b>
                    <span>{{currentGame.name  }}</span>
                  </div>
                  <div>
                    <b>区服：</b>
                    <span>{{form.qufu  }}</span>
                  </div>
                </div> -->

                <div class="sub-tit">
                  <formSubTitVue :title="'商品信息'" />
                </div>
                <el-form-item v-if="currentGame&&currentGame.id||isEdit" label="游戏名称" prop="gameName">
                  <b>{{form.gameName}}</b>
                </el-form-item>
                <el-form-item v-if="isEdit" label="游戏区服" prop="qufuIds">
                  <el-cascader @change="qufuChange" filterable clearable v-model="form.qufuIds" :options="qufuTree" :props="qufuProps"></el-cascader>
                </el-form-item>
                <el-form-item v-if="currentGame&&currentGame.id&&!isEdit" label="游戏区服" prop="">
                  <b>{{form.qufu}}</b>
                </el-form-item>
                <el-form-item label="商品售价" prop="price" v-if="!fabuJingpai">
                  <el-input v-model="form.price" placeholder="请输入价格" :disabled="isView" />
                </el-form-item>
                <el-form-item label="自编号" prop="thirdId" v-if="!fabuJingpai">
                  <el-input type="text" v-model="form.thirdId" placeholder="自己编写的编号,限20位" maxlength="20" :disabled="isView" />
                </el-form-item>

                <!-- v-if="form.isAutoImg!=2" -->
                <el-form-item v-if="form.isAutoImg!=2" label="商品标题" prop="title" class="row">
                  <el-input type="textarea" rows="2" v-model="form.title" placeholder="请输入商品标题，最多100个字" maxlength="100" show-word-limit :disabled="isView" />
                </el-form-item>
                <!-- v-if="form.isAutoImg!=2" -->
                <el-row style="background-color: #f8f8f8;margin-bottom: 10px;border-radius: 5px;" v-if="form.isAutoImg!=2">

                  <el-col :span="12">
                    <el-form-item class="row" label="商品首图" prop="">
                      <div class="" :class="{ hiddenupload: titleImgList.length }">
                        <el-input v-model="form.titleImg" v-show="false"></el-input>
                        <el-upload class :action="uploadImgUrl" :file-list="titleImgList" :show-file-list="true" list-type="picture-card" :limit="1" accept="image/png, image/jpeg" :on-success="handleAvatarSuccess" :on-remove="handleAvatarRemove" :http-request="uploadImgs"
                                   :on-preview="handlePictureCardPreview" :disabled="isView" :before-upload="beforeUploadImg">
                          <div class="uploadbg">
                            <img src="https://imgage.maimaihao.com/yuduhulian/erp/static/icon/uploadbg.png" alt="">
                            <br />
                            <span>选择图片</span>
                          </div>
                        </el-upload>
                        <el-button type="primary" style="width:150px;" @click="openGetInfoDialog" :loading="makeTitleImgBtnLoading">
                          首图生成</el-button>
                        <!-- <div class="colorred font12">
                          注意:使用首图生成前一定记得完善商品详情信息 否则无效哦!
                        </div> -->
                      </div>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item class="row" label="上传视频" v-if="!fabuJingpai">
                      <el-upload v-loading="videoLoading" list-type="picture-card" :headers="headers" action="#" :before-upload="beforeUploadVideo" :http-request="uploadVideoFn" :on-success="handleVideoSuccess" :limit="1" accept="video/mp4, video/mpeg4" v-if="!form.videoUrl">
                        <div class="uploadbg">
                          <img src="https://imgage.maimaihao.com/yuduhulian/erp/static/icon/uploadbg.png" alt="">
                          <br />
                          <span>选择视频</span>
                        </div>
                      </el-upload>
                      <div class="video-view radius flex" v-if="form.videoUrl">
                        <video controls :src="form.videoUrl"></video>
                        <span class="el-icon-delete" @click="handleVideoRemove"></span>
                      </div>
                      <div style="line-height: 26px;" class="colorred font12">视频格式:MP4格式 尺寸比例:16:9;请上传30MB以内的视频</div>
                    </el-form-item>
                  </el-col>
                </el-row>
                <!-- v-if="form.isAutoImg!=2" -->
                <el-form-item v-if="form.isAutoImg!=2" label="详情图片" class="row">
                  <div class="">
                    <!-- 自定义拖拽排序 -->
                    <draggable v-model="imgFileList">
                      <transition-group class="uploader">
                        <div v-for="(item, index) in imgFileList" :key="item.url" class="upload-list">
                          <img v-if="item.url" style="width: 100%; height: 100%" :src="
                                item.url.indexOf('blob:') > -1
                                  ? item.response && item.response.data
                                    ? item.response.data.filePath
                                    : item.url
                                  : item.url
                              " />
                          <img class="imgs" v-if="item.url" style="width: 30px" src="../../../assets/img/shangchuan.png" alt="" />
                          <div class="icon-container">
                            <span v-if="item.url" @click="handlePreviewNew(index)">
                              <i class="el-icon-zoom-in"></i>
                            </span>
                            <span v-if="
                                  item.url &&
                                  (!isView || (isEdit && form.saleState != 1))
                                " @click="handleRemove(item.url)">
                              <i class="el-icon-delete"></i>
                            </span>
                          </div>
                        </div>
                      </transition-group>
                    </draggable>
                    <el-upload :action="uploadImgUrl" :file-list="imgFileList" list-type="picture-card" :show-file-list="false" :on-preview="handlePictureCardPreview" :on-exceed="uploadNumber" :multiple="true" :drag="true" :before-upload="beforeUploadImg" :on-success="handleUploadSuccess"
                               :limit="100" accept="image/png, image/jpeg" :on-remove="handleRemove" :http-request="uploadImgs" :disabled="isView">
                      <div class="uploadbg">
                        <img src="https://imgage.maimaihao.com/yuduhulian/erp/static/icon/uploadbg.png" alt="">
                        <br />
                        <span>选择图片</span>
                      </div>
                    </el-upload>
                    <!-- <div style="line-height: 26px;" class="colorred font12">
                      注意:使用详情图生成前一定记得完善商品详情信息 否则无效哦!
                        <br />
                      支持JPEG、PNG格式,图片每张小于100M 最多上传80张
                    </div> -->
                    <el-button style="width:150px" type="primary" plain @click="openPhoneCode">
                      手机扫码上传</el-button>
                    <el-button style="width:150px" type="primary" @click="getDetailImgs" :loading="makeDetailImgBtnLoading" v-if="!isView">
                      详情图生成</el-button>

                  </div>

                </el-form-item>
              </div>
              <div class=" step-box ">
                <formSubTitVue :title="'基础信息'" />
                <el-form-item label="账号" prop="accountNumber">
                  <el-input v-model="form.accountNumber" placeholder="请输入账号" :disabled="isView" />
                </el-form-item>
                <el-form-item label="密码" prop="accountPassword" v-if="!fabuJingpai">
                  <el-input v-model="form.accountPassword" placeholder="请输入密码" :disabled="isView" />
                </el-form-item>
                <el-form-item label="手机号" prop="securityPhone" v-if="!fabuJingpai">
                  <!-- <el-input v-model="form.securityPhone" :placeholder="fabuJingpai?'请输入联系电话':'请输入绑定手机号'" maxlength="11" :disabled="isView" @change="phoneNumberChange" /> -->
                  <el-input v-show="false" v-model="form.securityPhone" placeholder="请输入手机号" />
                  <span class="phone-box">
                    <span v-if="form.securityPhone">{{ form.securityPhone }}</span>
                    <el-button v-if="!form.securityPhone" type="text" @click="openSelectPhone">
                      点击选择
                    </el-button>
                    <el-button style="margin-left: 10px;" v-if="form.securityPhone" type="del" @click="delPhone('phone')">
                      清空
                    </el-button>

                  </span>

                  <!-- <span class="phone-box" v-if="!fabuJingpai">
                    <el-button type="text" @click="openSelectPhone">选择卡位</el-button>
                  </span> -->
                </el-form-item>
                <el-form-item label="成本价" prop="costPrice" v-if="!fabuJingpai">
                  <el-input :controls="false" v-model="form.costPrice" placeholder="请输入成本价" :disabled="isView" />
                </el-form-item>

                <el-form-item label="是否置顶" prop="isTop" v-if="!fabuJingpai">
                  <div>
                    <el-radio-group v-model="form.isTop">
                      <el-radio :label="1">置顶</el-radio>
                      <el-radio :label="2">不置顶</el-radio>
                    </el-radio-group>
                  </div>
                </el-form-item>
                <el-form-item label="是否自营" prop="ifself" v-if="!fabuJingpai">
                  <div>
                    <el-radio-group v-model="form.ifself">
                      <el-radio :label="1">自营</el-radio>
                      <el-radio :label="2">代售</el-radio>
                    </el-radio-group>
                  </div>
                </el-form-item>
                <el-form-item class="row" label="其他信息" prop="importantRemark" v-if="!fabuJingpai">
                  <el-input v-model="form.importantRemark" type="textarea" placeholder="可以记录密保信息，采购渠道 包赔信息 卖家信息等，任意重要信息都可以放到此处 方便查找 限制500个字符" :rows="2" :disabled="isView" show-word-limit maxlength="500" />
                </el-form-item>
                <el-form-item label="支付截图" prop="" class="row">
                  <div class="" :class="{ hiddenupload: dakuanImgList.length }">
                    <el-input v-model="form.dakuanImg" v-show="false"></el-input>
                    <el-upload class :action="uploadImgUrl" :file-list="dakuanImgList" :show-file-list="true" list-type="picture-card" :limit="1" :on-success="dakuanImgSuccess" :on-remove="dakuanImgRemove" :on-preview="handlePictureCardPreview" :disabled="isView">
                      <div class="uploadbg">
                        <img src="https://imgage.maimaihao.com/yuduhulian/erp/static/icon/uploadbg.png" alt="">
                        <br />
                        <span>选择图片</span>
                      </div>
                    </el-upload>
                  </div>
                </el-form-item>
                <el-form-item label="其他截图" prop="" class="row">
                  <div class="">
                    <el-upload class :action="uploadImgUrl" :file-list="otherImgList" :show-file-list="true" list-type="picture-card" :limit="10" :multiple="true" :http-request="uploadImgs" :on-success="otherUploadSuccess" :on-remove="otherImgRemove" :on-preview="handlePictureCardPreview"
                               :on-exceed="uploadNumber2" :disabled="isView">
                      <div class="uploadbg">
                        <img src="https://imgage.maimaihao.com/yuduhulian/erp/static/icon/uploadbg.png" alt="">
                        <br />
                        <span>选择图片</span>
                      </div>
                    </el-upload>
                  </div>
                </el-form-item>
              </div>
            </el-form>
          </div>
          <!--  v-show="showReleasePage" -->
          <div class="release-page">
            <!-- @back="showReleasePage = false" -->
            <releaseTool :formData="infoData" :isEdit="isEdit" :isBackGoods="isBackGoods" @submit="getInfoData" @setTitle="setTitle" ref="releaseTool" @attrChange="attrChange"></releaseTool>
          </div>
        </div>

        <div class="center">
          <el-button class="font16" plain type="" @click="closeFn('')">关 闭 </el-button>
          <el-button v-if="!isBackGoods" class="font16" type="primary" @click="submitForm('form')" :loading="loading">{{!isBackGoods&&isEdit?'确认修改':'确认发布'}} </el-button>
          <el-button v-if="!isBackGoods&&isCanRefresh" class="font16" type="primary" @click="submitForm('form',5)" :loading="loading">修改并刷新 </el-button>
          <el-button v-if="isBackGoods" class="font16" type="warning" @click="submitForm('form',3)" :loading="loading">保 存</el-button>
          <el-button v-if="isBackGoods" class="font16" type="primary" @click="submitForm('form',4)" :loading="loading">确认发布</el-button>
        </div>
        <!-- 扫码上传弹窗 -->
        <el-dialog title="扫码上传详情图片" :visible.sync="qrCodeShow" width="620px" append-to-body>
          <div ref="qrcode" style="width:300px; height:300px;margin:0 auto;margin-bottom:15px"></div>
          <div style="color:#999">{{Code_url}}</div>
          <div class="center">
            <el-button type="primary" @click="finishImg">上传完成，请点击此处</el-button>
          </div>
        </el-dialog>

        <iframe id="xiaosuan" src="https://rpa-sdk.51bees.com/verifyUser.html" style="position: fixed;top: 0;left: 0;width: 100vh;height: 100vh;display: none;
" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"></iframe>

      </div>
    </el-dialog>

    <!-- 营地发布的 中间弹窗 -->
    <el-dialog title="营地获取发布" :visible.sync="yingdiDialogShow" width="620px" append-to-body>
      <el-form ref="form33" :model="form" :inline="true" :rules="rules33" class="new_form_box">
        <div style="margin-bottom: 10px;">
          <formSubTitVue :title="form.gameName"></formSubTitVue>
        </div>
        <div style="margin-bottom: 10px;" v-if="form.gameId==29">
          请输入掌瓦号快速获取，或者扫码授权获取。
        </div>
        <el-form-item v-if="form.gameId==2" label="" prop="yingdi">
          <el-input v-model="form.yingdi" placeholder="请输入王者营地ID"></el-input>
        </el-form-item>
        <el-form-item v-if="form.gameId==29" label="" prop="yingdi">
          <el-input v-model="form.yingdi" placeholder="请输入掌瓦号"></el-input>
        </el-form-item>
        <el-button v-if="form.gameId==29" type="primary" plain @click="yingdiNext" v-loading="loading">掌瓦号获取</el-button>
        <el-button v-if="form.gameId==29" type="primary" @click="yingdiNext(2)" v-loading="loading">扫码授权</el-button>

        <div style="height: 50px;">

        </div>

        <div class="center">
          <el-button type="primary" @click="yingdiNext" v-loading="loading">下一步</el-button>

        </div>
      </el-form>
    </el-dialog>

    <chongzhi ref="chongzhi"></chongzhi>
    <selectPhone ref="selectPhone" @change="getSelectPhone"></selectPhone>
  </div>
</template>

<script>
import selectBtnVue from "../components/select-btn.vue";
import releaseTool from "./releaseTool.vue";
import formSubTitVue from "@/views/tenantPages/components/formSubTit.vue";

// import ImageCompressor from "image-compressor.js";
import { postUpload, creatrandomStr, closerandomStr } from "@/api/upload";
import selectPhone from "./selectPhone.vue";
import gameConfigApi from "../../../api/gameConfig";
import goodsListApi from "../../../api/gameConfig/goodsList";
import gameListApi from "@/api/gameConfig/gameList";
import makeImgsV3 from "@/utils/makeImgs-v3";
import { getToken } from "@/utils/auth";
import lolAuth from "../../../components/getGameInfo/LOL.vue";
import cfAuth from "../../../components/getGameInfo/CF.vue";
import QRCode from "qrcodejs2";
import draggable from "vuedraggable";
import { spliceUploadHandle } from "@/api/spliceUpload.js";

import chongzhi from "@/views/tenantPages/moneys/components/chongzhijifen.vue";

import { uploadFileFn } from "../../../api/upload";

// 发布前置弹窗
import addBeforeDialog from "./addBeforeDialog.vue";

// import UPNG from 'upng-js';
export default {
  name: "addGoods",
  components: {
    releaseTool,
    formSubTitVue,
    selectBtnVue,
    selectPhone,
    lolAuth,
    cfAuth,
    draggable,
    chongzhi,
    addBeforeDialog,
  },
  data() {
    var validatePass = (rule, value, callback) => {
      if (!value) {
        callback();
      } else if (!/^1[3-9][0-9]\d{8}$/.test(value)) {
        callback(new Error("手机号不正确!"));
      } else {
        callback();
      }
    };
    var priceReg = (rule, value, callback) => {
      if (!value) {
        callback();
      } else if (!this.priceReg.test(value)) {
        callback(new Error("价格不正确!"));
      } else {
        callback();
      }
    };
    return {
      loading: false,
      isEdit: false,
      isView: false,
      isBackGoods: false,
      infoInputed: false, //是否已填写商品详情
      currentGame: {}, //当前选择的游戏
      showReleasePage: false,
      videoLoading: false,
      infoData: {
        isAutoImg: "",
      }, //传到发布工具页面填写的信息
      goodsId: "",

      Times: null,
      // times : null,
      step: 1, //发布账号步骤
      title: "新增游戏账号",
      pushAllList: [],
      pushGroupList: [],
      pushGroup: "", //选择的渠道分组
      checkboxGroup1: [],

      qufuSelect: [],
      qufuList: [],

      dialogVisible: false,
      btnLoading: false,
      makeTitleImgBtnLoading: false,
      makeDetailImgBtnLoading: false,

      roleList: [], //王者荣耀角色列表
      gameList: [], //展示的游戏
      AllgameList: [], //所有游戏
      keyword: "", //筛选游戏的关键字
      // 表单参数
      form: {
        gameId: "",
        title: "",
        gameName: "",
        gameType: "",
        price: "",
        accountNumber: "",
        accountPassword: "",
        securityPhone: "",
        telid: "",
        telnote: "",
        costPrice: "",
        importantRemark: "",
        titleImg: "",
        urlArr: [],
        videoUrl: "",
        thirdId: "",
        isTop: 2,
        ifself: 1,
        isAutoImg: "",
        dakuanImg: "",
        qufuIds: [],
        monitorTaskId: "",
        yingdi: "",
      },
      allData: {}, //接收到的属性信息  编辑时的回显信息
      selectedPhone: "",
      dakuanImgList: [], //打款截图
      otherImgList: [], //其他截图
      newOtherImages: [], //其他截图
      imgFileList: [],
      // imgShowList: [],
      titleImgList: [],
      videoList: [],
      ifSpecial: false,
      uploadImgUrl: "",
      uploadVideoUrl: "",
      headers: {},
      customAttr: null,
      newImages: [], //编辑的时候新增加的图片，新增的时候新增加的图片
      attrs: [],
      boxradioIsShow: "",
      uuid: "", //手机扫码上传的uuid，每次打开新增弹窗都生成新的
      retailDomain: {}, //选号站域名
      rules: {
        title: [{ required: true, message: "请输入商品标题", trigger: "blur" }],
        price: [
          { required: true, message: "请输入售价", trigger: "blur" },
          { validator: priceReg, trigger: "blur" },
        ],
        accountNumber: [
          { required: true, message: "请输入账号", trigger: "blur" },
        ],
        securityPhone: [{ validator: validatePass, trigger: "blur" }],
        costPrice: [{ validator: priceReg, trigger: "blur" }],
      },
      rules33: {
        yingdi: [
          { required: true, message: "请输入王者营地号", trigger: "change" },
        ],
      },
      qrCodeShow: false,
      Code_url: "",
      qrcode: null,
      backOrderId: "",
      xiaosuanLoading: null,
      fabuJingpai: false,
      shimingKey: "",
      refreshCost: "",
      isCanRefresh: false,
      routename: "",
      paramsId: "",
      paramsFlag: "",

      qufuTree: [], //区服树结构
      qufuProps: {
        value: "id",
        label: "fieldName",
        children: "childGameAttributes",
        expandTrigger: "hover",
      },

      yingdiDialogShow: false, //展示营地获取中间弹窗
    };
  },
  created() {
    this.headers = {
      Authorization: "Bearer " + getToken(),
    };
    this.uploadImgUrl = process.env.VUE_APP_BASE_API + "/upload/image";
    this.uploadVideoUrl = process.env.VUE_APP_BASE_API + "/upload/video";
  },
  computed: {
    userInfo() {
      return this.$store.getters.userInfo;
    },
    allGameList() {
      return this.$store.getters.allGameList;
    },
  },
  methods: {
    open(flag, id) {
      this.yingdiDialogShow = false;
      if (flag == "add" || flag == "backOrder" || flag == "jingpai") {
        this.$refs.addBeforeDialog.open(flag, id);
        this.paramsId = id;
        this.paramsFlag = flag;
      } else {
        this.openOld(flag, id);
      }
    },
    nextStep(formData) {
      console.log("%c Line:402 🍊 formData", "color:#465975", formData);
      this.currentGame = {
        name: formData.gameName,
        id: formData.gameId,
        type: formData.gameType,
      };
      this.form = {
        ...this.form,
        ...formData,
      };
      if (this.paramsFlag != "backOrder") {
        console.log(
          "%c Line:508 🧀 this.paramsFlag",
          "color:#f5ce50",
          this.paramsFlag
        );
        const allData = JSON.parse(JSON.stringify(this.form));
        delete allData.title;
        delete allData.price;
        delete allData.accountNumber;
        delete allData.accountPassword;
        delete allData.securityPhone;
        delete allData.telid;
        delete allData.isMyTel;
        delete allData.telnote;
        delete allData.costPrice;
        delete allData.importantRemark;
        delete allData.titleImg;
        delete allData.urlArr;
        delete allData.videoUrl;
        delete allData.thirdId;
        delete allData.isTop;
        delete allData.ifself;
        delete allData.id;
        delete allData.otherImg;
        this.infoData = { ...allData, reset: true };
      }
      this.openOld();
    },
    async openOld(flag, id) {
      if (flag) this.paramsFlag = flag;
      if (id) this.paramsId = id;
      this.dialogVisible = true;
      this.routename = "";
      this.isCanRefresh = false;
      // const isGame = await this.getGameList();
      // if (!isGame) {
      //   return;
      // }
      this.uuid = this.generateUUID() + "---" + this.userInfo.tenantId;
      this.shimingKey = "";
      this.dakuanImgList = [];
      this.$nextTick(() => {
        // window.removeEventListener("message", this.xiaosuanFn);
        this.fabuJingpai = false;
        this.isView = false;
        this.isEdit = false;
        this.isBackGoods = false;
        if (this.paramsFlag == "edit") {
          this.title = "修改商品信息";
          this.editGoodsStart(this.paramsId);
          this.getShuaxinYudou();
          this.isCanRefresh = true;
        }
        // else if (this.paramsFlag == "view") {
        //   this.title = "查看商品信息";
        //   this.isView = true;
        //   this.editGoodsStart(this.paramsId);
        // }
        else if (this.paramsFlag == "backOrder") {
          // 回收订单完成  发布商品
          this.title = "回收商品发布";
          this.isEdit = true;
          this.isBackGoods = true;
          this.huishouFabu(this.paramsId);
        } else if (this.paramsFlag == "jingpai") {
          //竞拍市场直接发布竞拍商品
          this.init();
          this.title = "发布竞拍商品";
          this.fabuJingpai = true;
        } else {
          this.init();
          this.title = "新增游戏账号";
        }
        // 营地发布的  王者荣耀 打开营地发布中间弹窗  扫码授权的打开授权码
        if (this.form.isAutoImg == 3) {
          this.form.yingdi = "";
          if (this.form.gameId == 2) {
            // 王者荣耀
            this.yingdiDialogShow = true;
          } else if (this.form.gameId == 29) {
            // 无畏契约
            this.yingdiDialogShow = true;
          } else {
            this.yingdiNext();
          }
        }
      });
      creatrandomStr({ randomStr: this.uuid });
      this.getData();
    },
    // 营地中间页  点击下一步
    yingdiNext(flag) {
      if (this.form.gameId == 2) {
        // 王者荣耀
        if (!this.form.yingdi) {
          return this.$message.error("请输入王者营地号！");
        }
      } else if (this.form.gameId == 29) {
        // 无畏契约
        if (flag == 2) {
          // 扫码授权
          this.form.yingdi = "";
        } else {
          if (!this.form.yingdi) {
            return this.$message.error("请输入掌瓦号！");
          }
        }
      }
      this.$refs.releaseTool.yingdiNext(this.form.yingdi);
      this.yingdiDialogShow = false;
    },
    // 初始化页面，清空所有数据
    init() {
      // this.currentGame = this.gameList[0];
      // this.form.gameId = this.currentGame.id;
      // this.form.gameType = this.currentGame.type;
      // this.form.gameName = this.currentGame.name;
      // this.infoData.gameId = this.currentGame.id;
      // this.infoData.gameType = this.currentGame.type;
      // this.infoData.gameName = this.currentGame.name;
      // this.getAttrList();
      this.isEdit = false;
    },
    // // 判断游戏是否为可快速发布的游戏
    // GetIsKuaiSu(id) {
    //   const kuaisuIds = [
    //     2, 5, 25, 6, 16, 10, 12, 37, 34, 29, 21, 8, 19, 4, 14, 11,
    //   ];
    //   return kuaisuIds.includes(id);
    // },
    //  获取刷新商品一次需要的虞豆
    getShuaxinYudou() {
      this.getDicts("points").then((res) => {
        if (res.data && res.data.length) {
          const obj = this.arrayToObject(res.data, "dictLabel");
          this.refreshCost = Math.abs(obj["refreshCost"].dictValue);
        }
      });
    },
    // 区服相关
    // 获取区服树结构
    getQufuTree(gameId) {
      this.qufuTree = [];
      let obj = {};
      obj.gameId = gameId || this.form.gameId;
      gameListApi.qufuTreeGetByGameId(obj).then((res) => {
        this.qufuTree = [...res.data];
      });
    },
    // 区服改变
    qufuChange(e) {
      console.log("%c Line:220 🍐 e", "color:#33a5ff", e);
      this.form.systemName = "";
      this.form.carrierName = "";
      this.form.groupName = "";
      this.form.serverName = "";

      this.form.systemId = "";
      this.form.carrierId = "";
      this.form.groupId = "";
      this.form.serverId = "";
      if (!e || e.length == 0) {

      } else {
        this.getQufuForQufuIds();
      }
    },
    // 处理区服
    getQufuForQufuIds() {
      // 处理区服
      let qufu = "";
      if (this.form.gameType == 1) {
        // 端游
        this.qufuTree.forEach((daqu) => {
          if (daqu.id == this.form.qufuIds[0]) {
            qufu += daqu.fieldName;
            this.form.groupId = daqu.id;
            this.form.groupName = daqu.fieldName;
            if (daqu.childGameAttributes && daqu.childGameAttributes.length) {
              daqu.childGameAttributes.forEach((fu) => {
                if (fu.id == this.form.qufuIds[1]) {
                  qufu += fu.fieldName;
                  this.form.serverId = fu.id;
                  this.form.serverName = fu.fieldName;
                }
              });
            }
          }
        });
      } else {
        // 手游
        this.qufuTree.forEach((sys) => {
          if (sys.id == this.form.qufuIds[0]) {
            qufu += sys.fieldName;
            this.form.systemId = sys.id;
            this.form.systemName = sys.fieldName;
            if (sys.childGameAttributes && sys.childGameAttributes.length) {
              sys.childGameAttributes.forEach((carr) => {
                if (carr.id == this.form.qufuIds[1]) {
                  qufu += carr.fieldName;
                  this.form.carrierId = carr.id;
                  this.form.carrierName = carr.fieldName;
                  if (
                    carr.childGameAttributes &&
                    carr.childGameAttributes.length
                  ) {
                    carr.childGameAttributes.forEach((daqu) => {
                      if (daqu.id == this.form.qufuIds[2]) {
                        qufu += daqu.fieldName;
                        this.form.groupId = daqu.id;
                        this.form.groupName = daqu.fieldName;
                        if (
                          daqu.childGameAttributes &&
                          daqu.childGameAttributes.length
                        ) {
                          daqu.childGameAttributes.forEach((fu) => {
                            if (fu.id == this.form.qufuIds[3]) {
                              qufu += fu.fieldName;
                              this.form.serverId = fu.id;
                              this.form.serverName = fu.fieldName;
                            }
                          });
                        }
                      }
                    });
                  }
                }
              });
            }
          }
        });
      }
      this.form.qufu = qufu;
      // this.GetIsKuaiSu(this.form.gameId)
    },
    // 区服相关 结束

    // 刷新商品排序
    shuaxinshangpin(id) {
      return new Promise((resolve, reject) => {
        this.$confirm(
          `刷新商品会提升该商品的排名，不同步三方渠道；<br/>每次操作消耗 <span style="color:red">${
            this.refreshCost || 0
          }</span> 虞豆，是否继续？`,
          "提示",
          {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "",
            dangerouslyUseHTMLString: true,
          }
        )
          .then(() => {
            this.loading = true;
            goodsListApi
              .goodsRefreshTime({ id: id })
              .then((res) => {
                this.loading = false;
                resolve();
                if (res.code == 200) {
                  this.$message({
                    type: "success",
                    message: "刷新成功!",
                  });
                } else {
                  this.$message({
                    type: "error",
                    message: res.msg,
                  });
                }
              })
              .catch((err) => {
                resolve();
                this.loading = false;
                if (err.code == 10000) {
                  // 虞豆不足
                  this.$message.error("虞豆不足，刷新失败");
                }
              });
          })
          .catch(() => {});
      });
    },
    // 查询选号网的域名
    getData() {
      this.getDicts("retailDomain").then((r) => {
        if (r.data && r.data.length) {
          this.retailDomain = this.arrayToObject(r.data, "dictLabel");
          this.Code_url = `${this.retailDomain["h5"].dictValue}pages/uploadImage/index/?uuid=${this.uuid}`;
        }
      });
    },
    // 生成扫码上传详情图的二维码
    // openPhoneCode() {
    //   this.uuid;
    //   console.log("%c Line:290 🥪 this.uuid", "color:#e41a6a", this.uuid);
    // },
    // 查询扫码上传的图片，并回显
    finishImg() {
      closerandomStr({ randomStr: this.uuid }).then((res) => {
        if (res.data) {
          let arr = res.data[this.uuid];
          if (arr && arr.length) {
            arr.forEach((r) => {
              r.url = r.src;
              r.name = "";
              // this.imgShowList.push(r)
              this.imgFileList.push(r);
            });
            // this.imgFileList =this.imgFileList.concat(arr) ;
            // this.imgShowList =this.imgShowList.concat(arr);
          }
          this.qrCodeShow = false;
        } else {
          this.qrCodeShow = false;
        }
      });
    },
    //生成扫码上传详情图的二维码
    async openPhoneCode() {
      this.qrCodeShow = true;
      this.$nextTick(() => {
        if (this.qrcode != null) {
          this.qrcode.clear(); // 清除代码
        } else {
          this.qrcode = new QRCode(this.$refs.qrcode, {
            width: 300,
            height: 300,
            correctLevel: QRCode.CorrectLevel.L,
          });
          //生成二维码
          this.qrcode.makeCode(this.Code_url);
        }
      });
    },
    // 编辑功能开始，isEdit
    editGoodsStart(goodsId) {
      ////console.log("%c Line:388 🍒 goodsId", "color:#3f7cff", goodsId);
      // this.reset("edit");
      // this.infoData.reset = false;
      this.goodsId = goodsId;
      this.isEdit = true;
      this.infoInputed = true;

      this.handleUpdate(goodsId);
    },
    // 回收订单完成，发布商品  开始
    huishouFabu(tempData) {
      ////console.log("%c Line:388 🍒 goodsId", "color:#3f7cff", goodsId);
      this.backOrderId = tempData.backOrderId;
      // this.reset("edit");
      // this.infoData.reset = false;
      this.isEdit = true;
      this.infoInputed = true;
      // 解析回显的数据
      let allData = JSON.parse(tempData.goodsContent);
      allData.isAutoImg = this.form.isAutoImg;
      let title = allData.title
        ? allData.title
        : allData.des
        ? allData.des.slice(0, 50)
        : "";
      title = title.replace(/\n/g, "");
      let obj = {
        gameId: allData.gameId,
        title: title,
        gameName: allData.gameName,
        gameType: allData.gameType,
        price: allData.price,
        accountNumber: allData.accountNumber,
        accountPassword: allData.accountPassword,
        securityPhone: allData.securityPhone,
        telid: allData.telid,
        isMyTel: allData.isMyTel,
        telnote: allData.telnote,
        costPrice: allData.costPrice,
        importantRemark: allData.importantRemark,
        titleImg: allData.titleImg,
        urlArr: allData.urlArr,
        videoUrl: allData.videoUrl,
        thirdId: allData.thirdId,
        isTop: allData.isTop || 2,
        ifself: allData.ifself || 1,
        otherImg: allData.otherImg,
        // qufuIds:
        //   allData.gameType == 1
        //     ? [allData.groupId, allData.serverId]
        //     : [
        //         allData.systemId,
        //         allData.carrierId,
        //         allData.groupId,
        //         allData.serverId,
        //       ],
      };
      delete allData.title;
      delete allData.price;
      delete allData.accountNumber;
      delete allData.accountPassword;
      delete allData.securityPhone;
      delete allData.telid;
      delete allData.isMyTel;
      delete allData.telnote;
      delete allData.costPrice;
      delete allData.importantRemark;
      delete allData.titleImg;
      delete allData.urlArr;
      delete allData.videoUrl;
      delete allData.thirdId;
      delete allData.isTop;
      delete allData.ifself;
      delete allData.id;
      delete allData.otherImg;
      this.form = { ...this.form, ...obj };

      this.allData = allData;
      if (obj.urlArr) {
        this.imgFileList = obj.urlArr;
        // this.imgShowList = JSON.parse(JSON.stringify(obj.urlArr));
      }
      if (obj.otherImg) {
        this.otherImgList = JSON.parse(obj.otherImg);
      }
      if (obj.titleImg) {
        this.titleImgList = [{ url: obj.titleImg, name: "" }];
      }
      let video = {};
      this.videoList = [];
      if (obj.videoUrl) {
        video.name = obj.videoName;
        video.url = obj.videoUrl;
        this.videoList[0] = video;
      }

      this.infoData = { ...this.allData, reset: true };
      this.getQufuTree(this.form.gameId);
      // this.getAttrList();
    },
    // 通知详情组件保存
    postInfoSave() {
      this.infoInputed = false;
      this.$refs.releaseTool.submitForm();
    },
    // attr改变
    attrChange(e) {
      this.attrs = e;
      // console.log("%c Line:384 🍓 this.attrs", "color:#ffdd4d", this.attrs);
    },
    // 获取详情填写页面传过来的数据
    getInfoData(e) {
      this.allData = JSON.parse(JSON.stringify(e));
      this.showReleasePage = false;
      this.infoInputed = true;
    },
    // 获取当前游戏的自定义属性
    // 获取游戏属性列表
    // async getAttrList() {
    //   this.loading = true;
    //   const res = await gameConfigApi.getGameConfig({
    //     gameId: this.form.gameId,
    //   });
    //   this.loading = false;
    //   if (res.code == 200) {
    //     let attrs = res.rows;
    //     this.attrs = JSON.parse(JSON.stringify(attrs));
    //   }
    // },
    // 打开选择手机弹窗
    openSelectPhone() {
      this.$refs.selectPhone.open(this.currentGame);
    },
    // 选择绑定手机
    async getSelectPhone(item) {
      if (item.zulinfangId) {
        // 租用的卡位
        this.form.isMyTel = 2;
        this.form.telid = item.telManageId;
        this.form.securityPhone = item.tel ? item.tel : "";
      } else {
        // 我的卡位
        this.form.telid = item.id;
        this.form.isMyTel = 1;
        this.form.securityPhone = item.tel ? item.tel : "";
      }
    },

    // 取消绑定手机
    delPhone() {
      this.selectedPhone = "";
      this.form.telid = "";
      this.form.telnote = "";
      this.form.securityPhone = "";
    },
    // 绑定的手机号输入框改变
    phoneNumberChange(e) {
      // console.log("%c Line:454 🥐 绑定的手机号输入框改变e", "color:#ffdd4d", e);
      this.form.telid = "";
      this.form.isMyTel = "";
    },
    // 关键字筛选游戏
    searchGame() {
      const str = this.keyword && this.keyword.trim();
      if (str) {
        this.gameList = this.AllgameList.filter((r) => {
          return r.name.includes(str);
        });
      } else {
        this.gameList = this.AllgameList;
      }
    },
    // 游戏列表
    async getGameList() {
      let res = await gameListApi.getCustomGamelist();
      // ////console.log("%c Line:278 🍫 res", "color:#465975", res);
      this.gameList = res.data;
      this.AllgameList = JSON.parse(JSON.stringify(res.data));
      if (this.AllgameList && this.AllgameList.length) {
        // this.currentGame = this.AllgameList[0];
        // this.form.gameId = this.AllgameList[0].id;
        // this.form.gameType = this.AllgameList[0].type;
        // this.form.gameName = this.AllgameList[0].name;
        // this.infoData.gameId = this.AllgameList[0].id;
        // this.infoData.gameType = this.AllgameList[0].type;
        // this.infoData.gameName = this.AllgameList[0].name;
        // this.getAttrList();
        return true;
      } else {
        this.$confirm("你还未设置游戏，是否立即设置游戏？", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {
            this.closeFn("GameSetting");
          })
          .catch(() => {
            this.closeFn();
          });
        return false;
      }
    },
    // 游戏类型切换
    // tabs切换时触发
    tabChange(e, item) {
      this.form.gameId = e;
      this.form.gameType = item.type;
      this.form.gameName = item.name;
      this.currentGame = item;
      this.infoData = {
        gameId: this.form.gameId,
        gameType: this.form.gameType,
        gameName: this.form.gameName,
      };
      this.infoInputed = false;
      // this.getAttrList();
    },

    // 重置
    reset(flag) {
      this.qufuTree = [];
      this.selectedPhone = "";
      // let gameId = this.form.gameId;
      // let gameName = this.form.gameName;
      // let gameType = this.form.gameType;
      // this.form = {
      //   gameId: "",
      //   title: "",
      //   gameName: "",
      //   gameType: "",
      //   price: "",
      //   accountNumber: "",
      //   accountPassword: "",
      //   securityPhone: "",
      //   telid: "",
      //   isMyTel: "",
      //   telnote: "",
      //   costPrice: "",
      //   importantRemark: "",
      //   titleImg: "",
      //   urlArr: "",
      //   videoUrl: "",
      //   thirdId: "",
      //   isTop: 2,
      //   ifself: 1,
      //   isAutoImg: "",
      //   dakuanImg: "",
      // };
      this.$refs["form"].resetFields();
      // this.form.gameId = gameId;
      // this.form.gameName = gameName;
      // this.form.gameType = gameType;
      this.imgFileList = [];
      // this.imgShowList = [];
      this.titleImgList = [];
      this.videoList = [];
      this.newImages = [];
      this.otherImgList = [];
      this.newOtherImages = [];
      this.attrs = [];
      this.allData = {};
      // if (flag != "edit") {
      //   this.infoData = {
      //     gameId: this.form.gameId,
      //     gameType: this.form.gameType,
      //     gameName: this.form.gameName,
      //     reset: true,
      //   };
      // }

      this.showReleasePage = false;
      this.infoInputed = false;
    },
    /** 查询详情进行回显 */
    handleUpdate(id) {
      // this.wzry = false;
      this.loading = true;
      goodsListApi.getGoodsDetail(id).then((response) => {
        this.loading = false;
        let allData = JSON.parse(JSON.stringify(response.data));
        allData.isAutoImg = 1;
        this.currentGame = {
          name: allData.gameName,
          id: allData.gameId,
          type: allData.gameType,
        };
        let obj = {
          gameId: allData.gameId,
          title: allData.title,
          gameName: allData.gameName,
          gameType: allData.gameType,
          price: allData.price,
          accountNumber: allData.accountNumber,
          accountPassword: allData.accountPassword,
          securityPhone: allData.securityPhone,
          telid: allData.telid,
          isMyTel: allData.isMyTel,
          telnote: allData.telnote,
          costPrice: allData.costPrice,
          importantRemark: allData.importantRemark,
          titleImg: allData.titleImg,
          urlArr: allData.urlArr,
          videoUrl: allData.videoUrl,
          thirdId: allData.thirdId,
          isTop: allData.isTop || 2,
          ifself: allData.ifself || 1,
          dakuanImg: allData.dakuanImg || "",
          otherImg: allData.otherImg || "",
          qufuIds:
            allData.gameType == 1
              ? [allData.groupId, allData.serverId]
              : [
                  allData.systemId,
                  allData.carrierId,
                  allData.groupId,
                  allData.serverId,
                ],
        };
        delete allData.title;
        delete allData.price;
        delete allData.accountNumber;
        delete allData.accountPassword;
        delete allData.securityPhone;
        delete allData.telid;
        delete allData.isMyTel;
        delete allData.telnote;
        delete allData.costPrice;
        delete allData.importantRemark;
        delete allData.titleImg;
        delete allData.urlArr;
        delete allData.videoUrl;
        delete allData.thirdId;
        delete allData.isTop;
        delete allData.ifself;
        delete allData.dakuanImg;
        delete allData.otherImg;
        this.form = obj;

        this.allData = allData;
        if (obj.urlArr) {
          this.imgFileList = obj.urlArr;
          // this.imgShowList = JSON.parse(JSON.stringify(obj.urlArr));
        }
        if (obj.otherImg) {
          this.otherImgList = JSON.parse(obj.otherImg);
        }
        if (obj.titleImg) {
          this.titleImgList = [{ url: obj.titleImg, name: "" }];
        }
        if (obj.dakuanImg) {
          this.dakuanImgList = [{ url: obj.dakuanImg, name: "" }];
        }
        let video = {};
        this.videoList = [];
        if (obj.videoUrl) {
          video.name = obj.videoName;
          video.url = obj.videoUrl;
          this.videoList[0] = video;
        }
        this.infoData = { ...this.allData, reset: true };

        this.getQufuTree(this.form.gameId);
        // this.getAttrList();
      });
    },
    // 一键获取信息后  自动设置标题
    setTitle(e) {
      if (e && e.length && !this.form.title) {
        this.form.title = e.substr(0, 100);
      }
    },
    /** 一键生成主图 */
    async makeTitleImg() {
      // 处理所有的填写项
      let allForm = {};
      let form1 = JSON.parse(JSON.stringify(this.form));
      let form2 = JSON.parse(JSON.stringify(this.allData));
      allForm = {
        ...form1,
        ...form2,
      };
      // 处理多选项，拼接duoxuan详情的LIST
      let list = [];
      let img = "";
      let str = "";
      this.attrs.forEach((t) => {
        if (t.fieldType == "checkbox" || t.fieldType == "boxradio") {
          if (allForm[t.aavName]) {
            str = str + allForm[t.aavName] + ",";
          }
        }
      });

      // 生成
      let obj = JSON.parse(JSON.stringify(allForm));
      let list2 = JSON.parse(JSON.stringify(this.attrs));
      obj.shopName = this.$store.state.user.shopInfo.tenantName;
      img = await makeImgsV3.makeTitleImgStart(obj, str, list2);
      return img;
    },
    /** 一键生成详情图 */
    async makeDetailImgs() {
      // 处理多选项，拼接duoxuan详情的LIST
      // 处理所有的填写项
      let allForm = {};
      let form1 = JSON.parse(JSON.stringify(this.form));
      let form2 = JSON.parse(JSON.stringify(this.allData));
      allForm = {
        ...form1,
        ...form2,
      };
      let list = [];
      let img = "";
      let str = "";
      this.attrs.forEach((t) => {
        if (t.fieldType == "checkbox") {
          if (allForm[t.aavName] && t.childAttributes) {
            for (let j = 0; j < t.childAttributes.length; j++) {
              let k = t.childAttributes[j];
              if (allForm[t.aavName].includes(k.id)) {
                list.push(k);
              }
            }
          }
        } else if (t.fieldType == "boxradio") {
          if (allForm[t.aavName] && t.childAttributes) {
            for (let j = 0; j < t.childAttributes.length; j++) {
              let k = t.childAttributes[j];
              if (k.childGameAttributes) {
                for (let l = 0; l < t.childGameAttributes.length; l++) {
                  let c = t.childGameAttributes[l];
                  if (allForm[t.aavName].includes(c.id)) {
                    list.push(c);
                  }
                }
              }
            }
          }
        }
      });
      // let res = await infoApi.getSelectList({
      //   ids: str
      // })
      // list = res.data
      // 生成
      img = await makeImgsV3.makeDetailImg(list);
      return img;
    },
    // 一键获取首图
    async openGetInfoDialog() {
      // 判断有没有填写详情
      await this.postInfoSave();
      if (!this.infoInputed) {
        return this.$message.error("请将右侧商品详情信息填写完整！");
      }
      this.makeTitleImgBtnLoading = true;
      let img = "";
      try {
        img = await this.makeTitleImg();
        this.makeTitleImgBtnLoading = false;
      } catch {
        this.makeTitleImgBtnLoading = false;
      }
      // 上传生成的base64图片
      if (img) {
        let titImg = this.base64ToBlob(img);
        console.log("%c Line:1300 🍐 titImg", "color:#33a5ff", titImg);
        const resFile = await uploadFileFn(titImg, this.userInfo.tenantId);
        const imgUrl = qiniu.imageMogr2(
          {
            strip: true, // 布尔值，是否去除图片中的元信息
            quality: 90, // 图片质量，取值范围1-100
            format: "jpg", // 新图的输出格式，取值范围：jpg，gif，png，webp等
          },
          resFile.key,
          resFile.domain
        );
        this.form.titleImg = decodeURIComponent(imgUrl);
        this.titleImgList = [{ url: imgUrl, name: "" }];
      }
    },
    // 点击生成多张详情图 新版
    async getDetailImgsNew() {
      // 判断有没有填写详情
      await this.postInfoSave();
      if (!this.infoInputed) {
        return this.$message.error("请将右侧商品详情信息填写完整！");
      }
      // 处理多选项，拼接duoxuan详情的LIST
      // 处理所有的填写项
      let allForm = {};
      let form1 = JSON.parse(JSON.stringify(this.form));
      let form2 = JSON.parse(JSON.stringify(this.allData));
      allForm = {
        ...form1,
        ...form2,
      };
      let list = [{}];
      let arrInd = 0;
      this.attrs.forEach((t) => {
        if (t.fieldType == "checkbox" && t.isEnable === "0") {
          if (
            allForm[t.aavName] &&
            t.childAttributes &&
            (this.form.gameId != 29 ||
              (this.form.gameId == 29 && t.aavName != "f2"))
          ) {
            list[arrInd] = {
              list: [],
              name: t.fieldName,
            };
            for (let j = 0; j < t.childAttributes.length; j++) {
              const k = t.childAttributes[j];
              if (allForm[t.aavName].includes(k.id) && k.imgUrl) {
                list[arrInd].list.push(k);
              }
            }
            arrInd++;
          }
        } else if (t.fieldType == "boxradio" && t.isEnable === "0") {
          if (allForm[t.aavName] && t.childAttributes) {
            list[arrInd] = {
              list: [],
              name: t.fieldName,
            };
            for (let j = 0; j < t.childAttributes.length; j++) {
              let k = t.childAttributes[j];
              if (k.childGameAttributes) {
                for (let l = 0; l < t.childGameAttributes.length; l++) {
                  let c = t.childGameAttributes[l];
                  if (allForm[t.aavName].includes(c.id)) {
                    list[arrInd].list.push(c);
                  }
                }
              }
            }
            arrInd++;
          }
        }
      });
      this.makeDetailImgBtnLoading = true;
      allForm.shopName = this.$store.state.user.shopInfo.tenantName;
      let imgs = await makeImgsV3.makeDetailImgMultiple(
        allForm,
        list,
        this.attrs
      );
      for (let i = 0; i < imgs.length; i++) {
        // 上传生成的base64图片
        let detailImg = this.base64ToBlob(JSON.parse(imgs[i]));
        // let formData = new FormData();
        // formData.append("file", detailImg);
        const resFile = await uploadFileFn(detailImg, this.userInfo.tenantId);
        const imgUrl = qiniu.imageMogr2(
          {
            strip: true, // 布尔值，是否去除图片中的元信息
            quality: 90, // 图片质量，取值范围1-100
            format: "jpg", // 新图的输出格式，取值范围：jpg，gif，png，webp等
          },
          resFile.key,
          resFile.domain
        );
        this.imgFileList.push({ url: decodeURIComponent(imgUrl), name: "" });
      }
      this.makeDetailImgBtnLoading = false;
    },
    // 点击生成详情图
    async getDetailImgs() {
      // 判断有没有填写详情
      await this.postInfoSave();
      if (!this.infoInputed) {
        return this.$message.error("请将右侧商品详情信息填写完整！");
      }
      // 和平精英 英雄联盟 英雄联盟手游 无畏契约 王者荣耀
      if (
        this.form.gameId == 5 ||
        this.form.gameId == 29 ||
        this.form.gameId == 3 ||
        this.form.gameId == 6 ||
        this.form.gameId == 2 ||
        this.form.gameId == 25
      ) {
        this.getDetailImgsNew();
      } else {
        this.makeDetailImgBtnLoading = true;
        let img = "";
        try {
          img = await this.makeDetailImgs();
          this.makeDetailImgBtnLoading = false;
        } catch {
          this.makeDetailImgBtnLoading = false;
        }
        // 上传生成的base64图片
        let detailImg = this.base64ToBlob(img);

        const resFile = await uploadFileFn(detailImg, this.userInfo.tenantId);
        const imgUrl = qiniu.imageMogr2(
          {
            strip: true, // 布尔值，是否去除图片中的元信息
            quality: 90, // 图片质量，取值范围1-100
            format: "jpg", // 新图的输出格式，取值范围：jpg，gif，png，webp等
          },
          resFile.key,
          resFile.domain
        );
        this.imgFileList.push({ url: decodeURIComponent(imgUrl), name: "" });
        // this.imgShowList.push({ url: res.msg, name: "" });
      }
    },
    // 图片转换
    base64ToBlob(code) {
      let parts = code.split(";base64,");
      let contentType = parts[0].split(":")[1];
      let raw = window.atob(parts[1]);
      let rawLength = raw.length;
      let uInt8Array = new Uint8Array(rawLength);

      for (let i = 0; i < rawLength; ++i) {
        uInt8Array[i] = raw.charCodeAt(i);
      }
      return new Blob([uInt8Array], { type: contentType });
    },
    // 上传视频前
    beforeUploadVideo(file) {
      if (file.size / 1024 / 1024 > 30) {
        this.$message.error("上传的视频不能超过30MB！请处理后再传！");
        return false;
      } else {
        return true;
      }
    },
    // 上传视频
    async uploadVideoFn(file) {
      //上传到后台
      this.videoLoading = true;
      try {
        const resFile = await uploadFileFn(file.file, this.userInfo.tenantId);
        file.data = {
          filePath: resFile.domain + resFile.key,
          fileName: resFile.key,
        };
        // file.data = {
        //   filePath: uploadImg.filePath,
        //   fileName: uploadImg.fileName,
        // };
        file.code = 200;
        this.videoLoading = false;
        return file;
      } catch {
        file.code = 500;
        this.videoLoading = false;
        return file;
      }
    },

    /**以下是图片上传相关 */
    // 限制图片大小
    beforeUploadImg(file) {
      if (file.size / 1024 / 1024 > 20) {
        this.$message.error("上传的图片不能超过20MB！请压缩后再传！");
        return false;
      } else {
        return true;
      }
    },
    uploadNumber(file, fileList) {
      //限制图片数量
      this.$modal.msgError("最多只能上传100张图片");
    },
    uploadNumber2(file, fileList) {
      //限制图片数量
      this.$modal.msgError("最多只能上传10张图片");
    },

    handleVideoSuccess(res, file) {
      // console.log("%c Line:857 🍤 res", "color:#ed9ec7", res);
      if (res.code == 200) {
        this.$set(this.form, "videoUrl", res.data.filePath);
        this.$set(this.form, "videoName", res.data.fileName);
      }
    },
    handleVideoRemove() {
      this.$set(this.form, "videoUrl", null);
      this.$set(this.form, "videoName", null);
    },
    // // 压缩图片
    // compressImage(file) {
    //   const fileData = file.file
    //   return new Promise(async (resolve, reject) => {
    //     if (fileData.size / 1024 / 1024 > 1) {
    //       if (fileData.type.includes("png")) {
    //         // Png 压缩
    //         const compressdedPng = await this.compressPNG(fileData)
    //         resolve (compressdedPng)
    //       } else {
    //         new ImageCompressor(fileData, {
    //           quality: 0.6,
    //           checkOrientation: false,
    //           mimeType: "image/jpeg",
    //           // width:1920,
    //           success(result) {
    //             resolve(result);
    //           },
    //           error(e) {
    //             reject();
    //           },
    //         });
    //       }
    //     } else {
    //       resolve(file.file);
    //     }
    //   });
    // },
    // // 压缩PNG图片
    // // 压缩 PNG
    // async compressPNG(file) {
    //   try {
    //     const arrayBuffer = await this.readFileAsArrayBuffer(file);
    //     const imageNuffer =  UPNG.decode(arrayBuffer); // 解码 PNG
    //     const imgData = this.alignTo4Bytes(imageNuffer.data)
    //     // 压缩参数：质量（0-1）、颜色位数（256 为有损压缩）
    //     const compressed = UPNG.encode(
    //       [imgData],
    //       imageNuffer.width,
    //       imageNuffer.height,
    //       256 * 0.7 // 70% 质量
    //     );
    //     // 转换为 Blob 并更新响应式数据
    //     const blob = new Blob([compressed], { type: "image/png" });
    //     return blob
    //   } catch (error) {
    //     console.error("压缩失败:", error);
    //   }
    // },
    // // 手动对齐
    // alignTo4Bytes(data) {
    //   const remainder = data.length % 4;
    //   if (remainder === 0) return data;
    //   const aligned = new Uint8Array(data.length + (4 - remainder));
    //   aligned.set(data);
    //   return aligned;
    // },
    // //文件读取为buffer
    // readFileAsArrayBuffer(file) {
    //   return new Promise((resolve, reject) => {
    //     const reader = new FileReader();
    //     reader.onload = (e) => resolve(e.target.result);
    //     reader.onerror = (e) => reject(e);
    //     reader.readAsArrayBuffer(file);
    //   });
    // },
    // 其他图片上传成功
    otherUploadSuccess(res, file, fileList) {
      if (fileList.every((item) => item.status == "success")) {
        let tempArr = this.otherImgList.map((m) => {
          return m.url;
        });
        fileList.forEach((t) => {
          if (
            t.url.indexOf("blob:") > -1 &&
            t.response &&
            t.response.data &&
            t.response.data.filePath
          ) {
            if (!tempArr.includes(t.response.data.filePath)) {
              this.otherImgList.push({
                url: t.response.data.filePath,
                name: "",
              });
            }
            return true;
          }
        });
      }
    },
    //  其他图片删除
    otherImgRemove(url) {
      // ////console.log("%c Line:495 🍎 response", "color:#4fff4B", response);
      const that = this;
      // 1.获取将要删除图片的临时路径
      // const filePath = response.url;
      // 2.找到图片对应的索引值
      this.otherImgList.forEach(function (element, key) {
        if (element.url === url) {
          that.otherImgList.splice(key, 1); //回显的图片
        }
      });
      // this.imgShowList.forEach(function (element, key) {
      //   if (element.url === filePath) {
      //     that.imgShowList.splice(key, 1); //回显的图片
      //   }
      // });
      this.newOtherImages.forEach(function (element, key) {
        if (element.url === url) {
          that.newOtherImages.splice(key, 1); //新上传的图片
        }
      });
    },

    // 上传图片
    async uploadImgs(file) {
      console.log("%c Line:466 🍆 压缩前file", "color:#2eafb0", file);
      // 获取压缩后的文件流
      let compreeBolb = await this.compressImage(file);
      console.log(
        "%c Line:468 🎂 压缩后compreeBolb",
        "color:#33a5ff",
        compreeBolb
      );
      // const formData = new FormData();
      // formData.append("file", compreeBolb); //压缩后的文件会自动转换成二进制文件流类型
      //上传图片到后台
      try {
        // let uploadImg = await postUpload(formData);
        const resFile = await uploadFileFn(compreeBolb, this.userInfo.tenantId);
        const imgUrl = qiniu.imageMogr2(
          {
            strip: true, // 布尔值，是否去除图片中的元信息
            quality: 90, // 图片质量，取值范围1-100
            format: "jpg", // 新图的输出格式，取值范围：jpg，gif，png，webp等
          },
          resFile.key,
          resFile.domain
        );
        file.data = {
          filePath: decodeURIComponent(imgUrl),
        };
        file.code = 200;
        return file;
      } catch {
        file.code = 500;
        return file;
      }
    },
    // 详情图片上传成功
    handleUploadSuccess(res, file, fileList) {
      if (fileList.every((item) => item.status == "success")) {
        let tempArr = this.imgFileList.map((m) => {
          return m.url;
        });
        fileList.forEach((t) => {
          if (
            t.url.indexOf("blob:") > -1 &&
            t.response &&
            t.response.data &&
            t.response.data.filePath
          ) {
            if (!tempArr.includes(t.response.data.filePath)) {
              this.imgFileList.push({
                url: t.response.data.filePath,
                name: "",
              });
            }
            return true;
          }
        });
      }
    },
    // 详情图片删除
    handleRemove(url) {
      // ////console.log("%c Line:495 🍎 response", "color:#4fff4B", response);
      const that = this;
      // 1.获取将要删除图片的临时路径
      // const filePath = response.url;
      // 2.找到图片对应的索引值
      this.imgFileList.forEach(function (element, key) {
        if (element.url === url) {
          that.imgFileList.splice(key, 1); //回显的图片
        }
      });
      // this.imgShowList.forEach(function (element, key) {
      //   if (element.url === filePath) {
      //     that.imgShowList.splice(key, 1); //回显的图片
      //   }
      // });
      this.newImages.forEach(function (element, key) {
        if (element.url === url) {
          that.newImages.splice(key, 1); //新上传的图片
        }
      });
    },
    // 图片预览
    handlePictureCardPreview(file) {
      this.$viewerApi({
        images: [file.url],
      });
    },
    // 处理图片预览效果
    handlePreviewNew(index) {
      let arr = [];
      this.imgFileList.map((item) => {
        arr.push(item.url);
      });
      this.$viewerApi({
        images: arr,
        options: {
          initialViewIndex: index,
        },
      });
    },
    imgPreview(url) {
      this.$viewerApi({
        images: [url],
      });
    },
    // 标题图片移除
    handleAvatarRemove(response, file) {
      this.form.titleImg = "";
      this.titleImgList = [];
    },
    // 标题图片上传成功
    handleAvatarSuccess(res, file) {
      if (res.code == 200) {
        let url = res.data.filePath;
        let name = res.data.fileName;
        let param = {};
        param.url = url;
        param.name = name;
        this.titleImgList.push(param);
        this.form.titleImg = res.data.filePath;
      }
    },

    // 提交
    submitForm(formName, flag) {
      this.$refs["form"].validate(async (valid) => {
        if (valid) {
          await this.postInfoSave();
          // 校验加入监控是否满足条件
          if (this.form.monitorTaskId) {
            let reg = new RegExp(/^[1-9][0-9]{4,10}$/);
            let reg2 = new RegExp(/^(1[0-9][0-9])\d{8}$/);
            let tel = "";
            tel = this.form.securityPhone;
            if (reg.test(this.form.accountNumber)) {
            } else {
              this.$alert(
                `您选择了加入监控，但是商品账号不是QQ号，请输入QQ账号或者不要选择加入监控！`
              );
              return;
            }
            if (reg2.test(tel)) {
            } else {
              this.$alert(
                `您选择了加入监控，但是未选择绑定手机号，请选择绑定手机号或者不要选择加入监控！`
              );
              return;
            }
          }
          if (!this.infoInputed) {
            this.$alert("请将右侧商品详情信息填写完整！");
            return;
          }
          if (this.isEdit && this.isCanRefresh && flag == 5) {
            await this.shuaxinshangpin(this.allData.id);
            return this.submitFormSure(formName, flag);
          }
          // 二次确认
          this.$confirm(
            `确定${
              this.isEdit ? (flag == 4 ? "发布" : "修改") : "发布"
            }该商品吗？`,
            "提示",
            {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning",
            }
          )
            .then(() => {
              this.submitFormSure(formName, flag);
            })
            .catch(() => {});
        } else {
          this.$alert("请填写完整！");
        }
      });
    },
    // 发布到竞拍市场
    /**
     * 
     *    gameId: this.form.gameId,
					gameName: this.form.gameName,
					des: this.form.des,
					region: this.form.region,
					accountNumber: this.form.accountNumber,
					hopeAmount: this.form.hopeAmount,
					contactPhone: this.form.contactPhone,
					img: JSON.stringify(this.fileList1),
					goodsContent: JSON.stringify(goodsInfoAndAttrValueDto),
     * 
     */
    fabuToJingpai(obj) {
      //
      const imgs = [...obj.urlArr];
      if (obj.titleImg) {
        imgs.push({
          name: "",
          url: obj.titleImg,
        });
      }
      this.attrs.forEach((t) => {
        if (t.fieldKey == "sm") {
          // 实名字段
          this.shimingKey = t.aavName;
        }
      });

      const param = {
        gameId: obj.gameId,
        gameName: obj.gameName,
        des: obj.des,
        region:
          obj.gameType == 1
            ? obj.groupName + obj.serverName
            : obj.systemName + obj.carrierName,
        accountNumber: obj.accountNumber,
        hopeAmount: "",
        contactPhone: obj.securityPhone,
        img: JSON.stringify(imgs),
        goodsContent: JSON.stringify(obj),
      };
      if (this.shimingKey) {
        // 找出实名状态
        param.relname = obj[this.shimingKey + "name"];
      }
      param;
      console.log("%c Line:1168 🍡 param", "color:#3f7cff", param);
      goodsListApi.addGoodsToJingpai(param).then((response) => {
        this.dialogVisible = false;
        this.$modal.msgSuccess("发布成功");
        this.attrs = [];
        this.$refs["form"].resetFields();
        this.reset();
        this.$emit("success");
      });
    },
    // 发布或修改确认
    submitFormSure(formName, flag) {
      // 拼接新上传的图片 this.newImages
      // console.log(
      //   "%c Line:921 🥝 this.newImages",
      //   "color:#ffdd4d",
      //   this.newImages
      // );
      if (this.newImages && this.newImages.length) {
        let newArr = [];
        this.newImages.forEach((img) => {
          newArr.push({
            name: img.name,
            url: img.response.data.filePath,
          });
        });
        this.form.urlArr = this.imgFileList.concat(newArr);
      } else {
        this.form.urlArr = this.imgFileList;
      }
      // 处理其他图片
      if (this.newOtherImages && this.newOtherImages.length) {
        let newArr = [];
        this.newOtherImages.forEach((img) => {
          newArr.push({
            name: img.name,
            url: img.response.data.filePath,
          });
        });
        this.form.otherImg = JSON.stringify(this.otherImgList.concat(newArr));
      } else {
        this.form.otherImg = JSON.stringify(this.otherImgList);
      }
      let obj = {
        ...this.form,
        ...this.allData,
      };
      if (this.fabuJingpai) {
        return this.fabuToJingpai(obj);
      }
      if (this.isEdit) {
        // 编辑
        if (flag == 3) {
          //回收商品 保存
          const obj2 = {
            id: this.backOrderId,
            goodsHandle: 1,
            goodsContent: JSON.stringify(obj),
          };
          goodsListApi.backClueOrderGoodsSave(obj2).then((response) => {
            // this.$modal.msgSuccess("编辑成功");
            this.attrs = [];
            this.$refs["form"].resetFields();
            this.reset();
            // 成功后提示
            this.dialogVisible = false;
            this.$alert("保存商品成功！", "提示", {
              confirmButtonText: "确定",
              callback: (action) => {
                this.$parent.getList();
              },
            });
          });
        } else if (flag == 4) {
          //回收商品 发布
          if (obj.price == 0 || !obj.price) {
            this.$confirm(`当前商品价格为 0 ，确认继续发布吗？`, "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning",
            })
              .then(() => {
                const obj2 = {
                  id: this.backOrderId,
                  goodsHandle: 2,
                  goodsContent: JSON.stringify(obj),
                };
                goodsListApi.backClueOrderGoodsSave(obj2).then((response) => {
                  // this.$modal.msgSuccess("编辑成功");
                  this.attrs = [];
                  this.$refs["form"].resetFields();
                  this.reset();
                  // 成功后提示
                  this.dialogVisible = false;
                  this.$alert(
                    "发布商品成功，请在商品审核菜单进行审核上架！",
                    "提示",
                    {
                      confirmButtonText: "确定",
                      callback: (action) => {
                        this.$parent.getList();
                      },
                    }
                  );
                });
              })
              .catch(() => {});
          } else {
            const obj2 = {
              id: this.backOrderId,
              goodsHandle: 2,
              goodsContent: JSON.stringify(obj),
            };
            goodsListApi.backClueOrderGoodsSave(obj2).then((response) => {
              // this.$modal.msgSuccess("编辑成功");
              this.attrs = [];
              this.$refs["form"].resetFields();
              this.reset();
              // 成功后提示
              this.dialogVisible = false;
              this.$alert(
                "发布商品成功，请在商品审核菜单进行审核上架！",
                "提示",
                {
                  confirmButtonText: "确定",
                  callback: (action) => {
                    this.$parent.getList();
                  },
                }
              );
            });
          }
        } else {
          // 正常编辑
          if (obj.price == 0 || !obj.price) {
            this.$confirm(`当前商品价格为 0 ，确认继续发布吗？`, "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning",
            })
              .then(() => {
                goodsListApi.editGoods(obj).then((response) => {
                  // this.$modal.msgSuccess("编辑成功");
                  this.attrs = [];
                  this.$refs["form"].resetFields();
                  this.reset();
                  // 成功后提示
                  this.dialogVisible = false;
                  this.$alert("修改商品成功！", "提示", {
                    confirmButtonText: "确定",
                    callback: (action) => {
                      this.$emit("success");
                    },
                  });
                });
              })
              .catch(() => {});
          } else {
            goodsListApi.editGoods(obj).then((response) => {
              // this.$modal.msgSuccess("编辑成功");
              this.attrs = [];
              this.$refs["form"].resetFields();
              this.reset();
              // 成功后提示
              this.dialogVisible = false;
              this.$alert("修改商品成功！", "提示", {
                confirmButtonText: "确定",
                callback: (action) => {
                  this.$emit("success");
                },
              });
            });
          }
        }
      } else {
        // 正常发布
        // 对接小算自动截图 obj
        // console.log("%c Line:1210 🌰 obj", "color:#ea7e5c", obj);

        if (obj.isAutoImg == 2) {
          // 判断是否填写密码
          if (
            !this.form.accountPassword ||
            this.form.accountPassword.trim() == ""
          ) {
            return this.$message.error("请填写账号登录密码！");
          }
          const xiaosuan = document.getElementById("xiaosuan").contentWindow;
          const data = {
            user: this.form.accountNumber,
            pwd: this.form.accountPassword,
            gameId: "10033",
            gamePlatform: "qq",
            actionType: "login",
            channel: "yxf_client",
          };
          if (this.form.gameId == 2) {
            //王者
            data.gamePlatform = "qq";
            data.gameId = "10034";
          }
          if (this.form.gameId == 3) {
            //和平
            data.gamePlatform = "qq";
            data.gameId = "10043";
          }
          if (this.form.gameId == 12) {
            //永劫无间
            data.gamePlatform = "netease_dashen";
            data.gameId = "10128";
          } else if (this.form.gameId == 34) {
            //暗区突围
            data.gamePlatform = "qq";
            data.gameId = "10078";
          } else if (this.form.gameId == 8) {
            //枪战王者
            data.gamePlatform = "qq";
            data.gameId = "10069";
          } else if (this.form.gameId == 19) {
            //使命召唤 手游
            data.gamePlatform = "qq";
            data.gameId = "10197";
          } else if (this.form.gameId == 4) {
            //原神
            data.gamePlatform = "mihoyo";
            if (this.form.carrierId == "41550") {
              data.gamePlatform = "bilibili";
            }

            data.gameId = "10031";
          } else if (this.form.gameId == 14) {
            //QQ飞车 手游
            data.gamePlatform = "qq";
            data.gameId = "10200";
          } else if (
            this.form.gameId == 37 ||
            this.form.gameId == 21 ||
            this.form.gameId == 11
          ) {
            //永劫无间手游  第五人格 光遇 无需验号  直接提交
            return this.commitNow(obj);
          } else if (this.form.gameId == 67) {
            //三角洲
            data.gamePlatform = "qq";
            data.gameId = "10181";
          }
          // 验号信息 data
          console.log("%c Line:1694 🍪验号信息 data", "color:#3f7cff", data);
          xiaosuan.postMessage(data, "*"); //开始验号
          // console.log("%c Line:1696 🥖 xiaosuan", "color:#33a5ff", xiaosuan);
          this.xiaosuanLoading = this.$loading({
            lock: true,
            text: "账号验证中,请耐心等待...",
            spinner: "el-icon-loading",
            color: "#fff",
            background: "rgba(0, 0, 0, 0.7)",
          });
          // window.removeEventListener("message", this.xiaosuanFn);
          let _this = this;
          window.addEventListener("message", function xiaosuanFn(e) {
            // console.log("%c Line:1706 🥒小算返回 e", "color:#33a5ff", e);
            let data = e.data; //返回结果
            let origin = e.origin; //返回的域名
            let isYanzhengma = false;
            if (origin == "https://rpa-sdk.51bees.com" && !!data.actionType) {
              console.log(
                "%c Line:1340 🍖小算返回 data",
                "color:#33a5ff",
                data
              );
              if (data.actionType == "data") {
                window.removeEventListener("message", xiaosuanFn);
                //data 返回的数据 结果数据
                if (data.data.code == 3001) {
                  _this.$message.success("验号通过");
                  // 验号通过
                  _this.commitNow(obj);
                } else {
                  if (data.data.code == 3011) {
                    if (_this.xiaosuanLoading) _this.xiaosuanLoading.close();
                    _this.$message.error("获取验证码超时");
                  } else if (data.data.code == 3005) {
                    if (_this.xiaosuanLoading) _this.xiaosuanLoading.close();
                    _this.$message.error("获取验证码超时 耗时:180s");
                  } else {
                    if (_this.xiaosuanLoading) _this.xiaosuanLoading.close();
                    _this.$message.error(
                      data.data.message || "游戏账号和密码不匹配！"
                    );
                  }
                }
              } else if (data.actionType == "VerifyCode" && !isYanzhengma) {
                //通知获取短信显示
                isYanzhengma = true;
                if (_this.xiaosuanLoading) _this.xiaosuanLoading.close();
                _this
                  .$prompt("请输入你收到的短信验证码", "提示", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    closeOnClickModal: false,
                  })
                  .then(({ value }) => {
                    const data = {
                      user: _this.form.accountNumber,
                      pwd: _this.form.accountPassword,
                      gameId: "10033",
                      gamePlatform: "qq",
                      actionType: "verifyCode",
                      channel: "yxf_client",
                      verifyCode: value,
                    };
                    if (_this.form.gameId == 2) {
                      //王者
                      data.gamePlatform = "qq";
                      data.gameId = "10034";
                    }
                    if (_this.form.gameId == 3) {
                      //和平
                      data.gamePlatform = "qq";
                      data.gameId = "10043";
                    }
                    if (_this.form.gameId == 12) {
                      //永劫无间
                      data.gamePlatform = "netease_dashen";
                      data.gameId = "10128";
                    } else if (_this.form.gameId == 34) {
                      // 暗区突围
                      data.gamePlatform = "qq";
                      data.gameId = "10078";
                    } else if (_this.form.gameId == 8) {
                      // 暗区突围
                      data.gamePlatform = "qq";
                      data.gameId = "10069";
                    } else if (_this.form.gameId == 19) {
                      // 暗区突围
                      data.gamePlatform = "qq";
                      data.gameId = "10197";
                    } else if (_this.form.gameId == 4) {
                      //原神
                      data.gamePlatform = "mihoyo";
                      if (_this.form.carrierId == "41550") {
                        data.gamePlatform = "bilibili";
                      }
                      data.gameId = "10031";
                    } else if (_this.form.gameId == 14) {
                      //QQ飞车 手游
                      data.gamePlatform = "qq";
                      data.gameId = "10200";
                    } else if (_this.form.gameId == 67) {
                      //三角洲
                      data.gamePlatform = "qq";
                      data.gameId = "10181";
                    }
                    // data
                    console.log(
                      "%c Line:1785 🥛输入验证码进行验证 data",
                      "color:#6ec1c2",
                      data
                    );
                    isYanzhengma = false;
                    xiaosuan.postMessage(data, "*"); //开始验号
                    _this.xiaosuanLoading = _this.$loading({
                      lock: true,
                      text: "账号验证中,请耐心等待...",
                      color: "#fff",
                      spinner: "el-icon-loading",
                      background: "rgba(0, 0, 0, 0.7)",
                    });
                  })
                  .catch(() => {});
              } else if (data.actionType == "slider") {
                // console.log("%c Line:1340 🍖小算返回 data","color:#33a5ff", data);
                window.removeEventListener("message", xiaosuanFn);
                //qq滑块显示
              } else if (data.actionType == "sliderEnd") {
                window.removeEventListener("message", xiaosuanFn);
                //qq滑块结束
              } else if (data.actionType == "submitHide") {
                window.removeEventListener("message", xiaosuanFn);
                //提交隐藏
              } else if (data.actionType == "closeSubmitHide") {
                window.removeEventListener("message", xiaosuanFn);
                //关闭隐藏
              } else {
                window.removeEventListener("message", xiaosuanFn);
              }
            }
          });
        } else {
          if (obj.price == 0 || !obj.price) {
            this.$confirm(`当前商品价格为 0 ，确认继续发布吗？`, "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning",
            })
              .then(() => {
                goodsListApi.addGoods(obj).then((response) => {
                  this.dialogVisible = false;
                  this.$modal.msgSuccess("新增成功");
                  this.attrs = [];
                  this.$refs["form"].resetFields();
                  this.reset();
                  this.$emit("success");
                });
              })
              .catch(() => {});
          } else {
            goodsListApi.addGoods(obj).then((response) => {
              this.dialogVisible = false;
              this.$modal.msgSuccess("新增成功");
              this.attrs = [];
              this.$refs["form"].resetFields();
              this.reset();
              this.$emit("success");
            });
          }
        }
      }
    },
    xiaosuanFn(e, obj) {
      let _this = this;
      let data = e.data; //返回结果
      console.log("%c Line:1225 🥃EventListener data", "color:#f5ce50", data);
      let origin = e.origin; //返回的域名
      if (origin == "https://rpa-sdk.51bees.com" && !!data.actionType) {
        if (data.actionType == "data") {
          //data 返回的数据 结果数据
          if (data.data.code == 3001) {
            _this.$message.success("验号通过");
            // 验号通过
            goodsListApi.addGoods(obj).then((response) => {
              if (_this.xiaosuanLoading) _this.xiaosuanLoading.close();
              if (response.code == 10000) {
                // 虞豆不足
                _this.$refs.chongzhi.open();
                return;
              }
              _this.dialogVisible = false;
              _this.$modal.msgSuccess("新增成功");
              _this.attrs = [];
              _this.$refs["form"].resetFields();
              _this.reset();
              _this.$emit("success");
              _this.$store.dispatch("getShopInfo");
            });
          } else {
            if (data.data.code == 3011) {
              if (_this.xiaosuanLoading) _this.xiaosuanLoading.close();
              _this.$message.error("获取验证码超时");
            } else {
              if (_this.xiaosuanLoading) _this.xiaosuanLoading.close();
              _this.$message.error("游戏账号和密码不匹配！");
            }
          }
        } else if (data.actionType == "VerifyCode") {
          //通知获取短信显示
          if (_this.xiaosuanLoading) _this.xiaosuanLoading.close();
          _this
            .$prompt("请输入你收到的短信验证码", "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              closeOnClickModal: false,
            })
            .then(({ value }) => {
              const data = {
                user: _this.form.accountNumber,
                pwd: _this.form.accountPassword,
                gameId: "10033",
                gamePlatform: "qq",
                actionType: "verifyCode",
                channel: "yxf_client",
                verifyCode: value,
              };
              if (_this.form.gameId == 12) {
                //永劫无间
                data.gamePlatform = "netease_dashen";
                data.gameId = "10128";
              }
              xiaosuan.postMessage(data, "*"); //开始验号
              _this.xiaosuanLoading = _this.$loading({
                lock: true,
                text: "账号验证中,请耐心等待...",
                color: "#fff",
                spinner: "el-icon-loading",
                background: "rgba(0, 0, 0, 0.7)",
              });
            })
            .catch(() => {});
        } else if (data.actionType == "slider") {
          //qq滑块显示
        } else if (data.actionType == "sliderEnd") {
          //qq滑块结束
        } else if (data.actionType == "submitHide") {
          //提交隐藏
        } else if (data.actionType == "closeSubmitHide") {
          //关闭隐藏
        }
      }
    },
    // 直接提交
    commitNow(obj) {
      goodsListApi.addGoods(obj).then((response) => {
        if (this.xiaosuanLoading) this.xiaosuanLoading.close();
        if (response.code == 10000) {
          // 虞豆不足
          this.$refs.chongzhi.open();
          return;
        }
        this.dialogVisible = false;
        this.$modal.msgSuccess("新增成功");
        this.attrs = [];
        this.$refs["form"].resetFields();
        this.reset();
        this.$emit("success");
        this.$store.dispatch("getShopInfo");
      });
    },
    //回收商品 保存
    // backGoodSave(){

    // },
    closeFn(routename) {
      if (routename) this.routename = routename;
      this.dialogVisible = false;
    },
    close() {
      this.reset();
      this.btnLoading = false;
      this.makeTitleImgBtnLoading = false;
      this.makeDetailImgBtnLoading = false;
      this.dialogVisible = false;
      if (this.routename) {
        this.$emit("close", this.routename);
      } else {
        this.$emit("close");
      }
    },
    // 打款截图上传成功
    dakuanImgSuccess(res, file) {
      if (res.code == 200) {
        let url = res.data.filePath;
        let name = res.data.fileName;
        let param = {};
        param.url = url;
        param.name = name;
        this.dakuanImgList.push(param);
        this.form.dakuanImg = res.data.filePath;
      }
    },
    // 打款截图移除
    dakuanImgRemove() {
      this.dakuanImgList = [];
      this.form.dakuanImg = "";
    },
  },
};
</script>
<style scoped lang="scss">
.ceshifont {
  font-family: myFontruihei5;
}
.add-edit-box {
  position: relative;
  height: calc(100% - 30px);
  > .flex {
    height: 100%;
  }
  .game-box {
    flex-wrap: wrap;

    .select-game-item {
      width: 60px;
      text-align: center;
      color: #666;
      font-size: 12px;
      margin-right: 5px;
      margin-bottom: 8px;
      cursor: pointer;

      overflow: hidden;
      .img {
        width: 50px;
        height: 50px;
        border-radius: 8px;
        overflow: hidden;
        position: relative;
        margin: 0 auto;

        img {
          width: 100%;
          height: 100%;
        }
      }
      &.active {
        color: #6c5dd3;
        font-weight: bold;
      }
      .sign {
        width: 50px;
        height: 20px;
        line-height: 22px;
        text-align: center;
        font-size: 11px;
        background-color: #6c5dd3;
        color: #fff;
        position: absolute;
        top: -2px;
        left: -16px;
        transform: rotate(-45deg);
      }
    }
  }
}
.center {
  // text-align: center;
  // width: 100%;
  // padding: 10px 0;
  padding-top: 10px;
  // margin-top: 10px;
  // box-shadow: 0 0 4px 1px rgba(0,0,0,0.1);
  border-top: 1px solid #f3f3f3;
  .el-button {
    width: 200px;
    height: 36px;
  }
}

.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}

.avatar-uploader .el-upload:hover {
  border-color: #409eff;
}

.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  line-height: 178px;
  text-align: center;
}

.avatar {
  width: 178px;
  height: 178px;
  display: block;
}

.boxradioitem {
  padding: 15px;
  border: 1px dashed #999;
  border-radius: 10px;
}

// .el-radio {
//   display: block;
//   line-height: 22px;
// }

// .boxradioRadioBox {
//   background: #fff;
//   box-shadow: 0 0 7px #e3e3e3;
//   padding: 10px;
//   position: absolute;
//   z-index: 99;
//   left: 20px;
//   top: 30px;
//   display: none;
// }

// .boxradioRadioBox.show {
//   display: block;
// }

// ::v-deep .form-box .el-upload-dragger {
//   width: $uploadWidth;
//   height: $uploadHeight;
//   border: none;
// }
// ::v-deep .form-box .el-upload--picture-card {
//   width: $uploadWidth;
//   height: $uploadHeight;
//   border: none;
// }
// ::v-deep .form-box .el-upload-list--picture-card .el-upload-list__item {
//   width: $uploadWidth;
//   height: $uploadHeight;
// }

.step-box {
  width: 100%;
  // padding: 10px;
  background-color: $fff;
  // margin-bottom: 16px;
}

.sub-tit {
  margin-bottom: 15px;
}
.yitian {
  color: $green;
  margin-left: 10px;
  cursor: pointer;
}
.weitian {
  color: $yellow;
  margin: 0 10px;
  cursor: pointer;
}
// .uploadbg {
//   width: $uploadWidth;
//   height: $uploadHeight;
// }
.video-view {
  width: 280px;
  height: 150px;
  // position: relative;
  // background: #409eff;
  align-items: flex-start;
  .el-icon-delete {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    font-size: 20px;
    margin-left: 10px;
    color: #666;
    cursor: pointer;
    // &:hover {
    //   color: $primary;
    // }
    // color: $fff;
  }
  video {
    width: 280px;
    height: 150px;
    border-radius: 10px;
  }
}
.phone-box {
  margin-left: 15px;
  .icon {
    // font-size: 30px;
    color: $primary;
  }
}
.release-page {
  // height: 100%;
  // overflow-y: auto;
  // position: absolute;
  // top: 0;
  // left: 0;
}
.add_dialog ::v-deep .el-dialog__body {
  height: calc(100vh - 60px) !important;
  max-height: calc(100vh - 50px) !important;
}
// ::v-deep .saoma .el-dialog__body {
//   height: 800px !important;
//   max-height: calc(100vh - 50px) !important;
// }
.form-box {
  width: 40%;
  min-width: 700px;
  flex-shrink: 0;
  height: 100%;
  overflow-y: auto;
  padding-right: 15px;
  box-sizing: border-box;
  border-right: 1px solid #f3f3f3;
}
.release-page {
  width: calc(60% - 10px);
  height: 100%;
  overflow-y: auto;
  flex-shrink: 0;
  box-sizing: border-box;
}

.uploader {
  display: flex;
  // align-items: center;
  flex-wrap: wrap;

  .upload-list {
    margin-right: 10px;
    margin-bottom: 10px;
    width: 100px;
    height: 100px;
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid #eee;
    position: relative;

    &:hover {
      .icon-container {
        display: block;
        transition: all 0.5s;
      }
    }

    .icon-container {
      position: absolute;
      display: none;
      transition: all 0.5s;
      width: 100%;
      height: 100%;
      line-height: 100px;
      color: #fff;
      font-size: 20px;
      text-align: center;
      border-radius: 8px;
      top: 0;
      left: 0;
      background-color: rgba(0, 0, 0, 0.5);
      cursor: pointer;

      span {
        margin: 0 10px;
        cursor: pointer;
      }
    }
  }

  .imgs {
    position: absolute;
    top: 0;
    right: 0;
  }
}

::v-deep .el-dialog__body {
  padding-top: 10px !important;
}
</style>
